<!DOCTYPE html>
<html lang="en" style="height:100%">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>注册</title>
    <link rel="stylesheet" type="text/css" href="../../css/api.css"/>
    <link rel="stylesheet" type="text/css" href="../../css/style.css"/>
    <link rel="stylesheet" type="text/css" href="../../css/yzl.css"/>
</head>
<body style="height:100%;">
<div id="blank" class="header">
    <div v-back-frame class="back small" tapmode></div>
    <span class="title">注册</span>
</div>
<div class="login" id="app" v-cloak>
    <div class="login-tip">
        <p>设置您的登录密码</p>
    </div>
    <div class="login-body">
        <div class="body-out">
            <div class="bd-line qrcode">
                <img v-src="'../../image/login_pas.png'" style="float: left ;"/>
                <div class="send-border" v-if="isClose">
                    <input type="password" placeholder="请输入密码" style="width: 50%;" v-model="password"/>
                    <img v-src="'../../image/login_eye.png'" v-myclick="[isClose, changeStyle]"
                         style="float: right ;width: 20px;height: 20px;margin-right: 8px;margin-top: 8px;" key="close"/>
                </div>
                <div class="send-border" v-if="!isClose">
                    <input type="text" placeholder="请输入密码" style="width: 50%;" v-model="password"/>
                    <img v-src="'../../image/login_open_eye.png'" v-myclick="[isClose, changeStyle]" key="open"
                         style="float: right ;width: 20px;height: 20px;margin-right: 8px;margin-top: 8px;"/>
                </div>
            </div>
            <div class="bd-line qrcode" style="position:relative;overflow:visible">
                <img v-src="'../../image/login_invite.png'" style="float: left ;"/>
                <div class="send-border">
                    <input type="text" placeholder="请输入邀请码(必填)" style="width: 56%;" v-model="invite_code"/>
                    <img v-src="'../../image/login_tip.png'" v-myclick="tipShow"
                         style="float: right ;width: 20px;height: 20px;margin-right: 8px;margin-top: 6px;"/>
                </div>
                <div class="ke-tip" v-if="isTip">
                    <span>如您没有邀请码，请关注“友人店”公众号获取。</span>
                </div>
            </div>
            <!-- <get-invite_code @send-invite_code="receiveInvite_code"></get-invite_code> -->
            <div class="bd-line qrcode" style="vertical-align: middle;padding-top: 14px;">
                <img v-if="!isAgree" v-src="'../../image/register_not_agree.png'" style="width: 18px;height: 18px;"
                     v-myclick="clickAgree" key="notAgree"/>
                <img v-if="isAgree" v-src="'../../image/register_agree.png'" style="width: 18px;height: 18px;"
                     v-myclick="clickAgree" key="agree"/>
                <span style="font-size: 14px;color:#808080;" @click="userAgreement()">已阅读并同意用户协议</span>
            </div>
            <div class="bt-login">
                <a class="btn register-btn" v-myclick="register">注册并登录</a>
            </div>
        </div>
    </div>
</div>
<script src="../../script/api.js"></script>
<script src="../../script/vue.js"></script>
<script src="../../script/app.js"></script>
<script src="../../script/common.js"></script>
<script src="../../script/url.js"></script>
<script src="../../script/components.js"></script>
<script>
    var wap_url;
    var talkingData;
    apiready = function () {
        setBSImg();
        new Vue({
            el: '#blank',
        });
        talkingData = api.require('talkingData');
        wap_url = getPrefs("wap_url");
        initApp();
        api.parseTapmode();

    };

    function initApp() {
        var isBigImg = Vue.BSImg == 'big';
        new Vue({
            el: '#app',
            data: {
                password: null,
                invite_code: null,
                verify_code_text: "发送验证码",
                isTip: false,
                time: 60,
                isClose: true,
                wap_url: wap_url,
                isAgree: true,
                BSImg: {
                    big: isBigImg,
                    small: !isBigImg
                },
                hasClicked:false,
            },
            methods: {
                userAgreement: function () {
                    var url = this.wap_url + 'home/agreement';
                    openWin('../home/browser', {url: url});
                },
                changeStyle: function (value) {
                    this.isClose = !value;
                },
                clickAgree: function () {
                    this.isAgree = !this.isAgree;
                },
                tipShow: function () {
                    this.isTip = !this.isTip
                },
                setPass: function (value) {
                    if (!this.phone) {
                        pinet.alert("请输入手机号");
                        return;
                    }
                    if (!this.verify_code) {
                        pinet.alert("请输入验证码");
                        return;
                    }
                    if (this.phone && this.verify_code) {
                        this.isShow = !value;
                    }
                },
                register: function () {
                    if (!this.isAgree) {
                        pinet.alert("请务必阅读用户协议");
                        return;
                    }
                    if (!this.password) {
                        pinet.alert("请输入密码");
                        return;
                    }
                    if (!this.invite_code) {
                        pinet.alert("请务必输入邀请码");
                        return;
                    }
                    if(this.hasClicked) {
                        return;
                    }
                    this.hasClicked = true;

                    var param = api.pageParam;
                    var data = {
                        "phone": param.phone,
                        "verify_code": param.verify_code,
                        "password": this.password,
                        "invite_code": this.invite_code
                    };
                    var that = this;
                    pinet.post(URL.register, data, function (data) {
                        showProgress();
                        pinet.alert(data.message);
                        var user = data.content;
                        setPrefs('user', user);
                        setPrefs('token', user.token);
                        setPrefs('member_id', user.member_id);
                        var otherAttr = {
                            bounces:false
                        };
                        that.hasClicked = false;
                        openWin('../../index', null, otherAttr);
                    }, function (ret) {
                        that.hasClicked = false;
                        pinet.alert(ret.message);
                    });
                },
                receiveInvite_code: function (val) {
                    this.invite_code = val;
                },
            }
        })
    }


</script>
</body>
</html>
